import React, {Component} from 'react';
import { NavBar} from 'antd-mobile';
import { connect } from 'react-redux';
import { withRouter } from 'react-router-dom'


import './header.less'

const mapState=(state)=>{
    return{
        pageTitle: state.ui.pageTitle,
        isSubpage: state.ui.isSubpage
    }
};

@withRouter
@connect(mapState)
class Header extends Component {
    render() {
        const navBarProps={};
        if(this.props.isSubpage){
            navBarProps.leftContent="返回";
            navBarProps.rightContent=<span>&#xe72f;</span>
            navBarProps.onLeftClick=this.props.history.goBack.bind(this);
        }else if(this.props.pageTitle==='购物车'){
            navBarProps.leftContent="返回";
            navBarProps.onLeftClick=this.props.history.goBack.bind(this);
        }
        return (
            <div className="pro-header">
                <NavBar
                    { ...navBarProps }
                >{this.props.pageTitle}</NavBar>
            </div>
        );


    }
}

export default Header;